第 1 步 - 在页面 (Pages) 窗口创建应用程序结构

在教程的这个步骤中，您将学习创建 Kanzi Studio 工程并为该工程导入您所需的资产。然后，您可以使用页面 (Pages) 窗口来创建应用程序结构。

教程资产

您在本教程中使用的资产存储在 <KanziWorkspace>/Tutorials/Pages/Assets 中。

<KanziWorkspace>/Tutorials/Pages/Completed 目录包含本教程已完成的工程。

创建工程并导入资产

在本节中，您将创建工程并导入用于创建本教程中的应用程序的资产。

要创建工程并导入资产：

1. 在 Kanzi Studio 的快速启动 (Quick Start) 屏幕中点击新建工程 (New Project)。
   
2. 在新建工程 (New Project) 窗口中为您的工程命名，并将模板 (Template) 设置为应用程序 (Application)。
   

   Kanzi 在 <KanziWorkspace>/Projects/<ProjectName>/Tool_project 目录中创建 Kanzi Studio 工程，并在 <KanziWorkspace>/Projects/<ProjectName>/Application 中创建工程的 Visual Studio 解决方案的结构：

   • bin 目录包含工程的二进制文件和配置文件。
   • configs 目录包含不同平台的配置文件。Kanzi 默认为几个不同的平台创建配置文件。适用于开发 Kanzi 应用程序的推荐平台是 Microsoft Visual Studio。请参阅 部署 Kanzi 应用程序。
   • src 包含您的工程的源代码。
   
3. 在工程 (Project) 中右键点击2D 视口 (Viewport 2D) 节点并选择删除 (Delete) 以删除节点。
   您可以删除2D 视口 (Viewport 2D) 节点，因为按本教程，您不会创建任何 3D 内容。
   
4. 在工程 (Project) 中选择屏幕 (Screen) 节点，在属性 (Properties) 中设置：
   • 指标类型 (Metrics Type) 为绝对 (Absolute)
   • 宽度 (Width) 为 1200
   • 高度 (Height) 为 720
   您可以这样设置应用程序屏幕的大小。
   
5. 在位于 Kanzi Studio 窗口底部的资产 (Assets) 窗口中点击导入资产 (Import Assets)。
   
6. 转到 <KanziWorkspace>/Tutorials/Pages/Assets 目录，选择所有文件，然后点击 打开 (Open)。
   Kanzi Studio 将所选资产导入到工程并在资产 (Assets) 窗口中显示。 使用资产 (Assets) 窗口查看、选择和使用工程中的资产。
   

创建应用程序结构

在本节中，您将学习使用页面 (Pages) 窗口中的工具通过页面 (Page) 和主页面 (Page Host) 节点创建应用程序结构。在 Kanzi Studio 中页面 (Pages) 窗口默认在素材库 (Library) 和字典 (Dictionaries) 窗口旁。

要创建应用程序结构：

1. 在页面 (Pages) 窗口将鼠标指针移到RootPage 上并点击 两次，在RootPage 节点下创建两个页面 (Page) 节点。
   您在页面 (Pages) 中创建页面 (Page) 节点时，也可以在工程 (Project) 中看到同样的页面 (Page) 节点。
   

   要在 页面 (Pages) 窗口中平移和放大，请使用以下快捷键件：

   动作	快捷键
   平移	点击鼠标中键并拖动。 按下 Space 键，然后点击鼠标左键并拖动。
   缩放	滚动鼠标滚轮。 按下 Shift 和 Alt 键，然后点击鼠标左键并拖动。

2. 在页面 (Pages) 中双击在上一步中创建的页面 (Page) 节点名称并将其重命名为 Applications 和SettingsRoot。
   在本教程中，主页面 (Page Host) 节点Applications 保存页面 (Page) 节点的内容，每个代表一个应用程序，而主页面 (Page Host) 节点SettingsRoot 保存显示在应用程序顶部的弹出窗口的内容。您可以在教程的最后一步创建 Settings 弹出窗口。
   
3. 在页面 (Pages) 中右键点击Applications 和SettingsRoot 节点并选择转换为主页面 (Convert to Page Host)。
   使用主页面 (Page Host) 节点来分组其他主页面 (Page Host) 和页面 (Page) 节点。页面 (Page) 节点和主页面 (Page Host) 节点之间的主要区别在于主页面 (Page Host) 节点管理其树中的导航请求和迁移。
   
4. 在页面 (Pages) 中将鼠标指针移到主页面 (Page Host) 节点Applications 并在该节点底部点击 三次，以在Applications 节点下创建三个子页面 (Page) 节点，并将其命名为 Home、Media 和 Car。
   这些页面 (Page) 节点每一个都保存其应用程序的内容。在本教程中您只需添加这些应用程序的图像进行原型制作。但是，应用程序从原型阶段移至开发阶段时，应将占位符替换为这些应用程序的内容。
   建议

   要查看应用程序中页面 (Page) 和主页面 (Page Host) 节点的整个结构，在页面 (Pages) 窗口中点击 。

   
5. 从资产 (Assets) 拖到页面 (Pages) 窗口：
   • Home_Page 纹理到Home 节点
   • Media_Page 纹理到Media 节点
   • Car_Page 纹理到Car 节点
   您从页面 (Page) 中的资产 (Assets) 或页面 (Pages) 中的主页面 (Page Host) 节点拖放图像时，Kanzi Studio会使用您拖放的图像创建一个图像 (Image) 节点。
   建议

   您点击页面 (Pages) 窗口中的任意页面 (Page) 或主页面 (Page Host) 节点时，Kanzi 迁移到该节点，您可以在预览 (Preview) 中查看该迁移。

   
6. 设置应用程序，使其在您启动应用程序时显示 Home 节点的内容：
   • 在工程 (Project) 中选择RootPage 节点，并在属性 (Properties) 中将默认子页 (Default Subpage) 属性设为 Applications 节点。
     通过设置默认子页 (Default Subpage) 属性，可以告诉 Kanzi 哪个页面 (Page) 或主页面 (Page Host) 节点在主页面 (Page Host) 活动时激活。
     
   • 在工程 (Project) 中选择Applications 节点，并在属性 (Properties) 中将默认子页 (Default Subpage) 属性设为Home。
     

另请参阅

要详细了解有关将资产导入到工程的信息，请参阅导入。

要详细了解有关页面 (Page) 和主页面 (Page Host) 节点的信息，请参阅使用页面 (Page) 和主页面 (Page Host) 节点。

打开导航